<template>
  <div id="box999" >
    <div >
      <Topbar></Topbar>
    </div>
    
    <div class="box1">
      <li>影院热映</li>
      <li>欧美新碟榜</li>
      <li>注册账号</li>
      <li>登录豆瓣</li>
    </div>
    <div class="box2" >
      <div class="box2-con">
          <h1 v-if="bool" style="font-size:0.4rem">请等待!!!!!</h1>
       
<Welist v-else v-for="(v,i) in arr" :key="i" :title01="v.commentTxt" :title02="v.userName" :imgurl="arr1[i]"/>
      </div>
     
       
    </div>

    
  </div>
</template>

<script>
import Topbar from "@/components/topbar.vue";
import Welist from "@/components/welist.vue";

import {getlink} from "@/api/getapi.js"

export default {
  components: {
    Topbar,
    Welist
  },
  data(){
    return {
      bool:true,
      arr:[],
      arr1:["we01.png","we02.png","we03.png","we04.png","we05.png","we06.png","we07.png","we08.png","we09.png","we05.png"]
    
    }
  },
  created(){
    getlink("http://api.artgoer.cn:8084/artgoer/api/v1/user/324380/v3/topic/topicHomeByLabel?pageIndex=1&token=b544cd63-6d42-46fe-a96c-3cf96bae3113&topicId=62187").then((ok)=>{
      console.log(ok.data.data.commentList);
      this.bool=false
      this.arr=ok.data.data.commentList
    })
  }
};
</script>

<style scoped>
#box999 {
  padding-top: 0.9rem;
  width: 100%;
  height: 100%;
}
.box1 {
  width: 100%;
  height: 1.2rem;
  font-size: 0.16rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  align-items: center;
  text-align: center;
}
li {
  width: 40%;
  height: 25%;
  
  background: #ccc;
}
.box2{
  width:100%;
  height:auto;
 

}
.box2-con{
  width:90%;
  height: auto;
  margin:0 auto;
}
</style>